import React, { useState, useEffect } from 'react';
import './addCreateProject.less';
import FirstStep from './components/firstStep/firstStep';
import SecondStep from './components/secondStep/secondStep';
import { history } from 'umi';

import { CheckCircleFilled } from '@ant-design/icons';
export default function () {
  const [isShow, setIsShow] = useState(1);
  const [oneData, setOneData] = useState({});
  const [twoData, setTwoData] = useState({});
  useEffect(() => {
    if (isShow == 3) {
      let a = { ...oneData, ...twoData };
      console.log('========', a);
    }
  }, [JSON.stringify(twoData)]);
  const nextClick = (e) => {
    setIsShow(e.step);
    // console.log(e);
    setOneData(e.data);
  };
  const nextClick1 = (e) => {
    setIsShow(e.step);
    // console.log(e);
    setTwoData(e.data);
  };
  return (
    <div className="project">
      {/* {isShow == 1 && <FirstStep nextClick={nextClick}></FirstStep>}
      {isShow == 2 && <SecondStep nextClick={nextClick}></SecondStep>} */}
      <div className={isShow == 1 ? '' : 'show-item'}>
        <FirstStep nextClick={nextClick}></FirstStep>
      </div>
      <div className={isShow == 2 ? '' : 'show-item'}>
        <SecondStep nextClick={nextClick1}></SecondStep>
      </div>
      <div className={isShow == 3 ? 'last-item' : 'show-item'}>
        <div className="project-all">
          <div className="circle">1</div>
          <div className="wire"></div>
          <div className="circle">2</div>
          <div className="wire"></div>
          <div className="circle">3</div>
        </div>
        <CheckCircleFilled className="item-icon" />
        <div className="titles-item">新建成功</div>
        <div className="foot-item">
          <div className="all-list">
            <div>项目编号：</div>
            <div>{oneData?.projectNumber}</div>
          </div>
          <div className="all-list1">
            <div>项目名称：</div>
            <div>{oneData?.projectName}</div>
          </div>
          <div className="all-list1">
            <div>项目地区：</div>
            <div>项目地址</div>
          </div>
          <div className="all-list1">
            <div>项目地址：</div>
            <div>{oneData?.activitySite}</div>
          </div>
        </div>
        <div className="btn-more">
          <div
            className="first-btn"
            onClick={() => {
              location.reload();
            }}
          >
            继续新建
          </div>
          <div
            className="first-btn1"
            onClick={() => {
              history.push('/home');
            }}
          >
            返回
          </div>
        </div>
      </div>
    </div>
  );
}
